<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Extends</title>
</head>
<body>
    <script>
        class Rectangle {
            constructor(height, width) {
                this.height = height;
                this.width = width;
            }

            get area() {
                return this.calcArea();
            }

            calcArea() {
                return this.height * this.width;
            }
        }

        const rectangle = new Rectangle(10, 20);
        console.log(rectangle.area);

        // 继承
        class Square extends Rectangle {
            constructor(length) {
                super(length, length);

                // 如果子类中存在构造函数，则需要在使用 this 之前调用 super()
                this.name = 'Square';
            }

            get area() {
                return this.height * this.width;
            }
        }

        const square = new Square(10);
        console.log(square.area);
    </script>
</body>
</html>